<template>
  <div class="wrapper" ref="wrapper">
      <div class="content">
          <slot></slot>
      </div>
  </div>
</template>

<script>
import BScroll from 'better-scroll'

export default {
    name:"Scroll",
    props:{
      probeType:{
        type:Number,
        default:0
      },
      pullUpLoad:{
        type:Boolean,
        default:false
      }
    },
    data(){
      return {
        bs:null,
      }
    },
    mounted() {
    this.bs = new BScroll(this.$refs.wrapper, {
      observeDom:true,
      observeImage:true,
      observe:true,
      probeType:this.probeType,
      pullUpLoad: this.pullUpLoad,
      click:true,
    });

    this.bs.on('pullingUp', () => {
      this.$emit('pullingUp');
    });

    this.bs.on('scroll',(position => {
      this.$emit('scroll',position);
    }))
  },
  methods:{
    scrollTo(x,y,time=300) {
      this.bs.scrollTo(x,y,time);
    },
    finishPullUp() {
      this.bs.finishPullUp();
      this.bs.refresh();
    },
  },
}
</script>

<style>

</style>